TypeScript Testiranje: Strategije za izvajanje testov s tipsko varnostjo za robustno kodo

V svetu razvoja programske opreme je zagotavljanje kakovosti kode najpomembnejše. TypeScript s svojim močnim sistemom tipkanja ponuja edinstveno priložnost za izgradnjo bolj zanesljivih in vzdržljivih aplikacij. Ta članek se poglablja v različne strategije testiranja TypeScript in poudarja, kako izkoristiti tipsko varnost za ustvarjanje robustnih in učinkovitih testov. Raziskali bomo različne pristope testiranja, ogrodja in najboljše prakse, s čimer vam bomo zagotovili celovit vodnik za testiranje TypeScript.

Zakaj je tipska varnost pomembna pri testiranju

TypeScriptov sistem statičnega tipkanja zagotavlja številne prednosti pri testiranju:

• Zgodnje odkrivanje napak: TypeScript lahko ujame napake, povezane s tipi, med razvojem, kar zmanjšuje verjetnost napak med izvajanjem.
• Izboljšano vzdrževanje kode: Zaradi tipov je kodo lažje razumeti in refaktorirati, kar vodi do bolj vzdržljivih testov.
• Izboljšana pokritost testov: Informacije o tipih lahko usmerjajo ustvarjanje celovitejših in ciljno usmerjenih testov.
• Skrajšan čas odpravljanja napak: Napake tipov je lažje diagnosticirati in popraviti v primerjavi z napakami med izvajanjem.

Ravni testiranja: Celovit pregled

Robustna strategija testiranja vključuje več ravni testiranja za zagotovitev celovite pokritosti. Te ravni vključujejo:

• Enotno testiranje: Testiranje posameznih komponent ali funkcij izolirano.
• Integracijsko testiranje: Testiranje interakcije med različnimi enotami ali moduli.
• Testiranje od konca do konca (E2E): Testiranje celotnega poteka dela aplikacije z uporabnikovega vidika.

Enotno testiranje v TypeScript: Zagotavljanje zanesljivosti na ravni komponent

Izbira ogrodja za enotno testiranje

Za TypeScript je na voljo več priljubljenih ogrodij za enotno testiranje, vključno z:

• Jest: Celovito ogrodje za testiranje z vgrajenimi funkcijami, kot so posnemanje, pokritost kode in testiranje s posnetki. Znan je po svoji enostavni uporabi in odlični učinkovitosti.
• Mocha: Prilagodljivo in razširljivo ogrodje za testiranje, ki zahteva dodatne knjižnice za funkcije, kot sta potrditev in posnemanje.
• Jasmine: Še eno priljubljeno ogrodje za testiranje s čisto in berljivo sintakso.

Za ta članek bomo predvsem uporabljali Jest zaradi njegove preprostosti in celovitih funkcij. Vendar pa se obravnavana načela uporabljajo tudi za druga ogrodja.

Primer: Enotno testiranje funkcije TypeScript

Razmislite o naslednji funkciji TypeScript, ki izračuna znesek popusta:

            // src/discountCalculator.ts
export function calculateDiscount(price: number, discountPercentage: number): number {
  if (price < 0 || discountPercentage < 0 || discountPercentage > 100) {
    throw new Error("Neveljaven vnos: Cena in odstotek popusta morata biti nenegativna, odstotek popusta pa mora biti med 0 in 100.");
  }
  return price * (discountPercentage / 100);
}

            

              
                Copy
              
            
          

Tukaj je, kako lahko napišete enotni test za to funkcijo z uporabo Jesta:

            // test/discountCalculator.test.ts
import { calculateDiscount } from '../src/discountCalculator';

describe('calculateDiscount', () => {
  it('should calculate the discount amount correctly', () => {
    expect(calculateDiscount(100, 10)).toBe(10);
    expect(calculateDiscount(50, 20)).toBe(10);
    expect(calculateDiscount(200, 5)).toBe(10);
  });

  it('should handle zero discount percentage correctly', () => {
    expect(calculateDiscount(100, 0)).toBe(0);
  });

  it('should handle 100% discount correctly', () => {
    expect(calculateDiscount(100, 100)).toBe(100);
  });

  it('should throw an error for invalid input (negative price)', () => {
    expect(() => calculateDiscount(-100, 10)).toThrowError("Neveljaven vnos: Cena in odstotek popusta morata biti nenegativna, odstotek popusta pa mora biti med 0 in 100.");
  });

  it('should throw an error for invalid input (negative discount percentage)', () => {
    expect(() => calculateDiscount(100, -10)).toThrowError("Neveljaven vnos: Cena in odstotek popusta morata biti nenegativna, odstotek popusta pa mora biti med 0 in 100.");
  });

  it('should throw an error for invalid input (discount percentage > 100)', () => {
    expect(() => calculateDiscount(100, 110)).toThrowError("Neveljaven vnos: Cena in odstotek popusta morata biti nenegativna, odstotek popusta pa mora biti med 0 in 100.");
  });
});

            

              
                Copy
              
            
          

Ta primer prikazuje, kako TypeScriptov sistem tipov pomaga zagotoviti, da se funkciji posredujejo pravilni podatkovni tipi in da testi pokrivajo različne scenarije, vključno z mejnimi primeri in pogoji napak.

Izkoriščanje tipov TypeScript v enotnih testih

TypeScriptov sistem tipov se lahko uporablja za izboljšanje jasnosti in vzdržljivosti enotnih testov. Na primer, vmesnike lahko uporabite za določitev pričakovane strukture objektov, ki jih vračajo funkcije:

            interface User {
  id: number;
  name: string;
  email: string;
}

function getUser(id: number): User {
  // ... implementation ...
  return { id: id, name: "John Doe", email: "john.doe@example.com" };
}

it('should return a user object with the correct properties', () => {
  const user = getUser(123);
  expect(user.id).toBe(123);
  expect(user.name).toBe('John Doe');
  expect(user.email).toBe('john.doe@example.com');
});

            

              
                Copy
              
            
          

Z uporabo vmesnika `User` zagotovite, da test preverja pravilne lastnosti in tipe, zaradi česar je bolj robusten in manj nagnjen k napakam.

Posnemanje in štoranje s TypeScript

Pri enotnem testiranju je pogosto treba izolirati enoto, ki se testira, s posnemanjem ali štorenjem njenih odvisnosti. TypeScriptov sistem tipov lahko pomaga zagotoviti, da so posnetki in štornice pravilno implementirani in da se držijo pričakovanih vmesnikov.

Razmislite o funkciji, ki se zanaša na zunanjo storitev za pridobivanje podatkov:

            interface DataService {
  getData(id: number): Promise<string>;
}

class MyComponent {
  constructor(private dataService: DataService) {}

  async fetchData(id: number): Promise<string> {
    return this.dataService.getData(id);
  }
}

            

              
                Copy
              
            
          

Za testiranje `MyComponent` lahko ustvarite posneto implementacijo `DataService`:

            class MockDataService implements DataService {
  getData(id: number): Promise<string> {
    return Promise.resolve(`Data for id ${id}`);
  }
}

it('should fetch data from the data service', async () => {
  const mockDataService = new MockDataService();
  const component = new MyComponent(mockDataService);
  const data = await component.fetchData(123);
  expect(data).toBe('Data for id 123');
});

            

              
                Copy
              
            
          

Z implementacijo vmesnika `DataService` `MockDataService` zagotavlja, da zagotavlja zahtevane metode s pravilnimi tipi, kar preprečuje napake, povezane s tipi, med testiranjem.

Integracijsko testiranje v TypeScript: Preverjanje interakcij med moduli

Integracijsko testiranje se osredotoča na preverjanje interakcij med različnimi enotami ali moduli znotraj aplikacije. Ta raven testiranja je ključna za zagotavljanje, da različni deli sistema pravilno delujejo skupaj.

Primer: Integracijsko testiranje z bazo podatkov

Razmislite o aplikaciji, ki komunicira z bazo podatkov za shranjevanje in pridobivanje podatkov. Integracijski test za to aplikacijo lahko vključuje:

• Nastavitev testne baze podatkov.
• Polnjenje baze podatkov s testnimi podatki.
• Izvajanje kode aplikacije, ki komunicira z bazo podatkov.
• Preverjanje, ali so podatki pravilno shranjeni in pridobljeni.
• Čiščenje testne baze podatkov po končanem testu.

            // integration/userRepository.test.ts
import { UserRepository } from '../src/userRepository';
import { DatabaseConnection } from '../src/databaseConnection';

describe('UserRepository', () => {
  let userRepository: UserRepository;
  let databaseConnection: DatabaseConnection;

  beforeAll(async () => {
    databaseConnection = new DatabaseConnection('test_database'); // Use a separate test database
    await databaseConnection.connect();
    userRepository = new UserRepository(databaseConnection);
  });

  afterAll(async () => {
    await databaseConnection.disconnect();
  });

  beforeEach(async () => {
    // Clear the database before each test
    await databaseConnection.clearDatabase();
  });

  it('should create a new user in the database', async () => {
    const newUser = { id: 1, name: 'Alice', email: 'alice@example.com' };
    await userRepository.createUser(newUser);

    const retrievedUser = await userRepository.getUserById(1);
    expect(retrievedUser).toEqual(newUser);
  });

  it('should retrieve a user from the database by ID', async () => {
    const existingUser = { id: 2, name: 'Bob', email: 'bob@example.com' };
    await userRepository.createUser(existingUser);

    const retrievedUser = await userRepository.getUserById(2);
    expect(retrievedUser).toEqual(existingUser);
  });
});

            

              
                Copy
              
            
          

Ta primer prikazuje, kako nastaviti testno okolje, komunicirati z bazo podatkov in preveriti, ali koda aplikacije pravilno shranjuje in pridobiva podatke. Uporaba vmesnikov TypeScript za entitete baze podatkov (npr. `User`) zagotavlja tipsko varnost skozi celoten postopek integracijskega testiranja.

Posnemanje zunanjih storitev v integracijskih testih

V integracijskih testih je pogosto treba posnemati zunanje storitve, od katerih je aplikacija odvisna. To vam omogoča, da preizkusite integracijo med vašo aplikacijo in storitvijo, ne da bi se dejansko zanašali na samo storitev.

Na primer, če se vaša aplikacija integrira s plačilnim prehodom, lahko ustvarite posneto implementacijo prehoda za simulacijo različnih scenarijev plačil.

Testiranje od konca do konca (E2E) v TypeScript: Simuliranje uporabniških potekov dela

Testiranje od konca do konca (E2E) vključuje testiranje celotnega poteka dela aplikacije z uporabnikovega vidika. Ta vrsta testiranja je ključna za zagotavljanje, da aplikacija pravilno deluje v resničnem okolju.

Izbira ogrodja za testiranje E2E

Za TypeScript je na voljo več priljubljenih ogrodij za testiranje E2E, vključno z:

• Cypress: Zmogljivo in uporabniku prijazno ogrodje za testiranje E2E, ki vam omogoča pisanje testov, ki simulirajo uporabniške interakcije z aplikacijo.
• Playwright: Ogrodje za testiranje med brskalniki, ki podpira več programskih jezikov, vključno s TypeScript.
• Puppeteer: Knjižnica Node, ki zagotavlja API visoke ravni za nadzor nad brezglavim Chromom ali Chromiumom.

Cypress je še posebej primeren za testiranje spletnih aplikacij E2E zaradi svoje enostavne uporabe in celovitih funkcij. Playwright je odličen za združljivost med brskalniki in napredne funkcije. Prikazali bomo koncepte testiranja E2E z uporabo Cypress.

Primer: Testiranje E2E s Cypress

Razmislite o preprosti spletni aplikaciji z obrazcem za prijavo. Test E2E za to aplikacijo lahko vključuje:

• Obisk strani za prijavo.
• Vnos veljavnih poverilnic.
• Pošiljanje obrazca.
• Preverjanje, ali je uporabnik preusmerjen na domačo stran.

            // cypress/integration/login.spec.ts
describe('Login', () => {
  it('should log in successfully with valid credentials', () => {
    cy.visit('/login');
    cy.get('#username').type('valid_user');
    cy.get('#password').type('valid_password');
    cy.get('button[type="submit"]').click();
    cy.url().should('include', '/home');
    cy.contains('Welcome, valid_user').should('be.visible');
  });

  it('should display an error message with invalid credentials', () => {
    cy.visit('/login');
    cy.get('#username').type('invalid_user');
    cy.get('#password').type('invalid_password');
    cy.get('button[type="submit"]').click();
    cy.contains('Invalid username or password').should('be.visible');
  });
});

            

              
                Copy
              
            
          

Ta primer prikazuje, kako uporabiti Cypress za simulacijo uporabniških interakcij s spletno aplikacijo in preverjanje, ali se aplikacija obnaša, kot je pričakovano. Cypress ponuja zmogljiv API za interakcijo z DOM, izvajanje potrditev in simuliranje uporabniških dogodkov.

Tipska varnost v testih Cypress

Čeprav je Cypress primarno ogrodje, ki temelji na JavaScriptu, lahko še vedno izkoristite TypeScript za izboljšanje tipske varnosti vaših testov E2E. Na primer, TypeScript lahko uporabite za definiranje ukazov po meri in za tipkanje podatkov, ki jih vračajo klici API.

Najboljše prakse za testiranje TypeScript

Če želite zagotoviti, da so vaši testi TypeScript učinkoviti in vzdržljivi, upoštevajte naslednje najboljše prakse:

• Pišite teste zgodaj in pogosto: Integrirajte testiranje v svoj razvojni potek dela že od samega začetka. Razvoj na podlagi testov (TDD) je odličen pristop.
• Osredotočite se na testiranje: Oblikujte svojo kodo tako, da jo bo mogoče enostavno testirati. Uporabite injiciranje odvisnosti, da ločite komponente in jih olajšate posnemanje.
• Ohranite majhne in osredotočene teste: Vsak test naj se osredotoča na en sam vidik kode. To olajša razumevanje in vzdrževanje testov.
• Uporabite opisna imena testov: Izberite imena testov, ki jasno opisujejo, kaj test preverja.
• Vzdržujte visoko raven pokritosti testov: Prizadevajte si za visoko pokritost testov, da zagotovite, da so vsi deli kode ustrezno preizkušeni.
• Avtomatizirajte svoje teste: Integrirajte svoje teste v neprekinjen integracijski (CI) cevovod, da samodejno izvajate teste, kadar koli pride do sprememb kode.
• Uporabite orodja za pokritost kode: Uporabite orodja za merjenje pokritosti testov in prepoznavanje območij kode, ki niso ustrezno preizkušena.
• Redno refaktorirajte teste: Ko se vaša koda spreminja, refaktorirajte svoje teste, da bodo posodobljeni in vzdržljivi.
• Dokumentirajte svoje teste: Dodajte komentarje k svojim testom, da pojasnite namen testa in morebitne predpostavke, ki jih vsebuje.
• Upoštevajte vzorec AAA: Priprava, Izvedba, Potrditev. To pomaga strukturirati vaše teste za berljivost.

Zaključek: Gradnja robustnih aplikacij s tipsko varnim testiranjem TypeScript

TypeScriptov močan sistem tipkanja zagotavlja močno podlago za izgradnjo robustnih in vzdržljivih aplikacij. Z izkoriščanjem tipske varnosti v svojih strategijah testiranja lahko ustvarite bolj zanesljive in učinkovite teste, ki zgodaj ujamejo napake in izboljšajo splošno kakovost vaše kode. Ta članek je raziskal različne strategije testiranja TypeScript, od enotnega testiranja do integracijskega testiranja do testiranja od konca do konca, in vam ponudil celovit vodnik za testiranje TypeScript. Z upoštevanjem najboljših praks, opisanih v tem članku, lahko zagotovite, da so vaše aplikacije TypeScript temeljito preizkušene in pripravljene za proizvodnjo. Sprejetje celovitega pristopa k testiranju že od samega začetka razvijalcem po vsem svetu omogoča ustvarjanje bolj zanesljive in vzdržljive programske opreme, kar vodi do izboljšanih uporabniških izkušenj in zmanjšanih stroškov razvoja. Ker se uporaba TypeScript še naprej povečuje, obvladovanje testiranja s tipsko varnostjo postaja vse bolj dragocena veščina za inženirje programske opreme po vsem svetu.